import Vue from 'vue'
import Router from 'vue-router'
import Page1 from './views/Page1.vue';
import Page2 from '@/views/Page2.vue';
import Page3 from '@/views/Page3.vue';
import Dashboard from '@/views/Dashboard.vue';

import Login from '@/views/Login.vue';
import store from './store';
// 插件挂载
Vue.use(Router)

// function func (route) {
//   return {
//     id: route.params.id,
//     msg: route.params.msg,
//     foo: route.query.foo
//   }
// }

//给props传这个函数，props提供参数，路由route，然后可以进行 简写 参数解构
function func({ params, query }) {
  console.log('路由', params);

  return {
    id: params.id,
    msg: params.msg,
    foo: query.foo
  }
}

const router = new Router({
  mode: 'history',
  // base: process.env.BASE_URL,
  routes: [
    { path: '/', redirect: '/page1' }, // 默认首页，重定向
    { path: '/page1/:foo', component: Page1, props: true }, //动态传参，把route.params传过去，需要在当前组件上props声明 ,也就是 url里的值
    { path: '/page2', component: Page2 },
    { path: '/page2/:id/:msg', component: Page2, name: 'page2', props: func }, // 动态路径参数 以冒号开头m, : 后面相当于一个占位符，this.$route.params的一个属性名，设置了props就必须在对应组件上 接收props参数

    { path: '/static', component: Page1, props: { foo: 'basr' } }, // 给组件传静态值

    { path: '/login', name: 'login', component: Login },

    {
      path: '/dashboard',
      component: Dashboard,
      beforeEnter(to, from, next) {
        if (store.state.isLogin) {
          next()
        } else {
          next('/login?redirect=' + to.path)  //登陆之后返回所要到的页面
        }
      },
      children: [
        {
          path: 'page3', component: Page3
        }, // 不要加 / 这是嵌套dashboard/page3, /page3还是根地址
      ]
    },

  ]
});

//全局路由守卫

// router.beforeEach((to, from, next) => {
//   console.log('to', to);
//   console.log('from', from);
//   if (to.path != '/login') { //to 要去的页面不是登陆页面时，要求登陆
//     if (window.isLogin) {
//       next()
//     } else {
//       next('/login?redirect=' + to.path)  //登陆之后返回所要到的页面
//     }
//   } else { // 直接去登陆时
//     next()
//   }
// })

router.afterEach((to, from) => { //路由的后置狗子
console.log('afterEach-to',to);
console.log('afterEach-from',from);
}) 
export default router

// component 不是components